﻿<div class="layui-card" id="AdminAdd">
    <div class="layui-card-header">
        <i class="fa fa-home fa-fw"></i>管理员添加
        <div class="f-r">
            <button class="layui-btn layui-btn-primary layui-btn-sm" v-on:click="back()"><i class="fa fa-mail-reply fa-fw"></i>返回</button>
        </div>
    </div>
    <div class="layui-card-body" id="AdminForm">
        <div class="layui-form-item">
            <form class="layui-form layui-form-pane" action="" lay-filter="AdminForm">
                <div class="layui-form-item">
                    <label class="layui-form-label"><i>*</i>账户</label>
                    <div class="layui-input-block">
                        <input type="text" name="Account" autocomplete="off" placeholder="" class="layui-input" lay-verify="required">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><i>*</i>密码</label>
                    <div class="layui-input-block">
                        <input type="password" name="Password" autocomplete="off" placeholder="" class="layui-input" lay-verify="pass">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><i>*</i>真实姓名</label>
                    <div class="layui-input-block">
                        <input type="text" name="TrueName" autocomplete="off" placeholder="" class="layui-input" lay-verify="required">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><i>*</i>角色</label>
                    <div class="layui-input-inline">
                        <select name="RoleId" lay-verify="required" id="RoleId">
                            <option value="">请选择分类</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><i>*</i>电话</label>
                    <div class="layui-input-block">
                        <input type="text" name="Phone" autocomplete="off" placeholder="" class="layui-input" lay-verify="required|phone">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">邮箱</label>
                    <div class="layui-input-block">
                        <input type="text" name="Email" autocomplete="off" placeholder="" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item" pane="">
                    <label class="layui-form-label"><i>*</i>是否启用</label>
                    <div class="layui-input-block">
                        <input type="checkbox" checked="" value="1" name="IsUsing" lay-skin="switch" lay-filter="IsUsing" lay-text="ON|OFF">
                    </div>
                </div>
                <div class="layui-form-item text-center">
                    <button class="layui-btn" lay-submit="" lay-filter="AddAdmin">立即提交</button>
                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>

            </form>
        </div>
        <!-- 内容主体区域结束 -->
    </div>
</div>
<script>
    frame.createPage({
        mounted: function() {
            var page = this;
            page.vm = Vue.createApp({
                data() {
                    return {
                        roles: [],
                        referrer: "",
                    }
                },
                mounted: function() {
                    this.GetRoles();
                    this.InitForm();
                },
                methods: {
                    back: function() {
                        frame.Back(page.url, res => {
                            res.laytable.reload()
                        })
                    },
                    GetRoles: function() {
                        lg.request({
                            url: "/base/getRolesForOption",
                            success: res => {
                                if (res.code == 0) {
                                    if (res.data != null) {
                                        lg.select.fill({
                                            data: res.data,
                                            value: "Id",
                                            text: "Name",
                                            target: "#RoleId"
                                        })
                                        layui.form.render();
                                    }
                                }
                            }
                        })
                    },
                    InitForm: function() {
                        var that = this;
                        var form = layui.form;
                        form.render();
                        form.on("submit(AddAdmin)", function(d) {
                            var data = d.field;
                            lg.request({
                                url: "/base/AddAdmin",
                                data: data,
                                method: 'post',
                                success: function(d) {
                                    if (d.code == 0) {
                                        layer.msg("添加成功！", { icon: 1 });
                                        page.vm.back();
                                    } else {
                                        layer.msg(d.msg, { icon: 2 })
                                    }
                                }
                            })
                            return false;
                        })
                        form.verify({
                            pass: [
                                /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[\s\S]{8,30}$/
                                , '密码必须8到30位,且格式为数字，大小写字母，特殊字符的组合'
                            ]
                        });
                    }
                }
            }).mount("#AdminAdd")
        },
    }).mount();
</script>
